<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:p="http://primefaces.org/ui">

<ui:composition>
	<h:form>
		<p:panel styleClass="controles2"
			rendered="#{!controlesSeguridadMBean.viewModulos}">
			<div class="filaItem"
				style="border-bottom: 1px solid rgb(228, 220, 220);">
				<div class="columnaItem">
					<h:outputLabel value="Periodo" for="idPeriodo"
						styleClass="labelColumna" />
					<p:selectOneMenu id="idPeriodo"
						value="#{resumenProyClientesMarcasMBean.periodoDefault}">
						<f:selectItem itemLabel="- Periodo -" itemValue="0" />
						<f:selectItems
							value="#{resumenProyClientesMarcasMBean.listaPeriodos}"
							var="itemPeriodo" itemLabel="#{itemPeriodo.descripcion}"
							itemValue="#{itemPeriodo.id}" />
					</p:selectOneMenu>
				</div>
				<div class="columnaItem">
					<h:outputLabel styleClass="labelColumna" value="Zona" for="idZona" />
					<p:selectOneMenu id="idZona"
						value="#{resumenProyClientesMarcasMBean.idZona}">
						<p:ajax listener="#{resumenProyClientesMarcasMBean.cargarFFVV()}"
							update="idFfvv" />
						<f:selectItem itemLabel="-Seleccionar-" itemValue="0" />
						<f:selectItems value="#{resumenProyClientesMarcasMBean.listaZonas}"
							var="itemZona" itemLabel="#{itemZona.codigo}"
							itemValue="#{itemZona.id}" />
					</p:selectOneMenu>
				</div>
				<div class="columnaItem">
					<h:outputLabel styleClass="labelColumna" value="Canal"
						for="idCanal" />
					<p:selectOneMenu id="idCanal"
						value="#{resumenProyClientesMarcasMBean.idCanal}">
						<p:ajax event="change"
							listener="#{resumenProyClientesMarcasMBean.cargarFFVV()}"
							update="idFfvv" />
						<f:selectItem itemLabel="-Seleccionar-" itemValue="0" />
						<f:selectItems value="#{resumenProyClientesMarcasMBean.listaCanales}"
							var="itemCanal" itemLabel="#{itemCanal.categoria}"
							itemValue="#{itemCanal.id}" />
					</p:selectOneMenu>
				</div>
				<div class="columnaItem">
					<h:outputLabel value="FFVV" for="idFfvv" styleClass="labelColumna" />
					<p:selectOneMenu id="idFfvv"
						value="#{resumenProyClientesMarcasMBean.idFfvv}">
						<p:ajax listener="#{resumenProyClientesMarcasMBean.cargarClientes()}"
							update="idCliente" />
						<f:selectItem itemLabel="- Todos -" itemValue="0" />
						<f:selectItems value="#{resumenProyClientesMarcasMBean.listaFFVV}"
							var="fv" itemLabel="#{fv.apellido}" itemValue="#{fv.id}" />
					</p:selectOneMenu>
				</div>
			</div>
			<div class="filaItem" style="padding-top: 10px;">
				<div class="columnaItem">
					<h:outputLabel styleClass="labelColumna" value="Cliente"
						for="idCliente" />
					<p:selectOneMenu id="idCliente"
						value="#{resumenProyClientesMarcasMBean.idLocalCliente}">
						<f:selectItem itemLabel="-Seleccionar-" itemValue="0" />
						<f:selectItems
							value="#{resumenProyClientesMarcasMBean.listaClientes}"
							var="itemCliente" itemLabel="#{itemCliente.nombreAmostrar}"
							itemValue="#{itemCliente.clienteLocalesId}" />
					</p:selectOneMenu>
				</div>
				<div class="columnaItem">
					<div class="inputOptions">
						<div style="margin-left: 10px">
							<p:commandButton value="Mostrar" style="font-size: 12px; margin-top: 5px;"
								update=":tabProyeccion:tableResumenMarcas"
								actionListener="#{resumenProyClientesMarcasMBean.inicializar()}"
								id="frmMostrar" />
						</div>
					</div>
				</div>
			</div>
		</p:panel>
	</h:form>
	<h:form id="tableResumenMarcas">
		<p:dataTable var="proyeccion"
			value="#{resumenProyClientesMarcasMBean.listaProyeccionClienteMarcas}"
			sortBy="#{proyeccion.marca}">
			<p:column headerText="Id" sortBy="#{proyeccion.idMarca}">
				<h:outputText value="#{proyeccion.idMarca}" />
			</p:column>
			<p:column headerText="Marca" sortBy="#{proyeccion.marca}">
				<h:outputText value="#{proyeccion.marca}" />
			</p:column>
			<p:column headerText="Monto" sortBy="#{proyeccion.montoTotal}"
				style="text-align:right">
				<h:outputText value="#{proyeccion.montoTotal}">
					<f:convertNumber currencySymbol="S/. " groupingUsed="true"
						maxFractionDigits="2" type="currency" />
				</h:outputText>
			</p:column>
			<p:columnGroup type="footer">
				<p:row>
					<p:column style="text-align:right" />
					<p:column footerText="Total: " style="text-align:right" />
					<p:column
						footerText="S/. #{resumenProyClientesMarcasMBean.totalMarcas}"
						style="text-align:right">
					</p:column>
				</p:row>
			</p:columnGroup>
		</p:dataTable>
	</h:form>
</ui:composition>
</html>